<template>
  <div>
    <van-nav-bar title="联系人列表" left-arrow @click-left="onClickLeft" />
    <van-address-list
      v-model="chosenAddressId"
      :list="list"
      @select="chooseAddress"
      default-tag-text="默认"
      @add="onAdd"
      @edit="onEdit"
      :switchable="isSelect"
    />
  </div>
</template>

<script>
import { AddressList, Toast, NavBar } from "vant";
import { getAddress } from "@/network/index.js";
export default {
  name: "Contact",
  data() {
    return {
      list: [],
      isSelect: true,
      chosenAddressId: 0,
    };
  },
  
  components: {
    [AddressList.name]: AddressList,
    [Toast.name]: Toast,
    [NavBar.name]: NavBar,
  },
  methods: {
    onClickLeft() {
      this.$router.back();
    },
    onAdd() {
      this.$router.push({ name: "ContactEdit" }); //添加时跳转到添加页面
    },
    chooseAddress(item,index) { //选择地址项时
      this.$router.back() //返回上级路由
      this.$store.commit('saveAddress',item) //保存地址信息进入vuex
    },
    //获取收货地址
    async getAddress() {
      const {
        data: { data },
      } = await getAddress();
      for(let i of data.list) {
        i.address = i.province + i.city + i.county + i.addressDetail
        if(i.isDefault) {
          this.chosenAddressId = i.id
        }
      }
      this.list = data.list
      
    },
    onEdit(item, index) {
      this.$router.push({name:'ContactEdit',query:{id:item.id}})
    },
  },
  created() {
    //组件创建时获取收货地址列表数据
    if(Object.prototype.hasOwnProperty.call(this.$route.query,'isSwitch')) {
      this.isSelect = false
    }
    this.getAddress();
  },
  mounted() {},
};
</script>

<style lang="less" scoped>
</style>

